*{
    margin: 0;
    padding: 0;
    list-style: none;
    text-decoration: none;
}
.clearfix:after{
    display: block;
    clear: both;
    content:"";
}
html,body{
    width:100%;
    height:100%;
    font-size:12px;
    font-family: "微软雅黑";
}
a{
    color:#000;
}
.header{
    width:1840px;
    height:60px;
    border-bottom: 1px solid #eee;
    margin-left:40px;
}
#box{
    width:1920px;
    height:61px;
    background-color:#fff;
}
.box{
    position: fixed;
    z-index: 3;
}
.header>.header-logo{
    float: left;
}
.header>.header-logo>ul li{
    float: left;
    font-size:16.33px;
    margin-top:16px;
    margin-right: 40px;
    padding-bottom: 20px;
}
.header>.header-logo>ul li:hover,.header>.header-path>ul li:hover{
    color: #4f9bfd;
}
.header>.header-logo>ul{
    margin-left:66px;
}
.header>.header-logo>ul a{
    color: #000;
}
.header>.header-logo>div{
    margin-top:12px;
}
.header .items{
    color: #4f9bfd;
    border-bottom: 2px solid #4f9bfd;
}
.header>.header-logo>div,.header>.header-logo>ul,.header>.header-path>div,.header>.header-path>ul{
    float: left;
}
.header>.header-path{
    float: right;
}
.header>.header-path>ul li{
    padding-left: 40px;
    float: left;
    margin-top:24px;
}
.header>.header-path>ul .lis{
    padding-left: 0px;
}
.header>.header-path div{
    padding:6px 15px 6px 17px;
    -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
    margin-top:17px;
    border:1px solid #4f9bfd;
    color: #4f9bfd;
}
.header>.header-path a{
    float: left;
}
.swiper-container{
    width:1920px;
    height:580px;

}
.swiper-container img{
    width:100%;
    height:100%;
}
.title-1{
    margin: 0 auto;
    width:288px;
}
.title-1 div{
    font-size:22px;
    padding-top:70px;
    padding-bottom: 17px;
    font-weight: bolder;
    width:100%;
    text-align: center;
}
.title-1 p{
    color: #aaaaaa;
    font-size:16px;
    width:100%;
    text-align: center;
    padding-bottom: 25px;
}
hr{
    margin: 0 auto;
}
.wrapper{
    width:1200px;
    margin: 50px auto;
    border:2px solid red;
}
.art-top{
    margin-top:40px;
}
.article{
    width:280px;
    padding-bottom:37px;
    margin-right:24px;
    float: left;
    border:1px solid #eee;
    transition: 0.4s linear;
    position: relative;
    top:0px;
}
.article:hover{
    box-shadow: 0px 4px 30px -10px #dfe7f2;
    border:1px solid #fff;
    cursor:pointer;
    top:-4px;
}
.wrapper .active{
    margin-right:0px;
}
.article .article-img{
    width:100%;
    height:170px;
    /*background: url("../images/web元素/sk.png") no-repeat;*/
    /*-webkit-background-size:100% 100%;*/
    /*-moz-background-size:100% 100%;*/
}
.article .article-img{
    width:100%;
    height:100%;
}
.article .article-size{
    /*padding-left:16px;*/
    /*padding-top:30px;*/
    padding:30px 20px 16px 20px;
    line-height: 25px;
    font-size:16px;
    font-weight: bolder;
}
.article-g{
    margin-left:20px;
    padding-bottom:20px;
    margin-right:20px;
    border-bottom: 1px solid #eee;
}

.article-g div{
    float: left;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border:1px solid #bbbbbb;
    width:70px;
    height:20px;
    line-height: 20px;
    text-align: center;
    margin-right: 5px;
    color: #bbbbbb;
}

.article .article-d>div{
    margin:20px;
    font-size:14px;
}
.article .article-d>div>div{
    float: left;
}
.article .article-d>div .article-right{
    float: right;
}
.article .article-spa{
    padding-left:12px;
}
.article-pro{
    float: left;
    width:160px;
    height:10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    background: -webkit-linear-gradient(to right,#4f9bfd,cyan);
    background: -o-linear-gradient(to right,#4f9bfd,cyan);
    background: -moz-linear-gradient(to right,#4f9bfd,cyan);
    background: -ms-linear-gradient(to right,#4f9bfd,cyan);
    background: linear-gradient(to right,#4f9bfd,cyan);
}
.content{
    width:1200px;
    margin:72px auto;
}
.content .content-left{
    /*padding:40px 40px 44px 40px;*/
    width:587px;
    border:1px solid #eee;
    float: left;
    transition: 0.4s linear;
}
.content .content-right{
    float: right;
}
.content .content-left div{
    padding-bottom:36px;
}
.content .content-left div{
    padding-left:40px;
    width:506px;
}
.content .content-left .content-top{
    padding-bottom:46px;
    padding-top:40px;
}
.content .content-left .content-p1{
    font-size:16px;
    font-weight: bolder;
}
.content .content-left .content-p2{
    font-size:12px;
}
.content .content-left .content-f{
    float: left;
    width:224px;
    overflow: hidden;
    white-space: nowrap;
}
.content .content-left .content-f:hover{
    color: #3389ff;
    text-overflow:ellipsis;

}
.content .content-left .content-p3{
    color: #b7b7b7;
    float: right;

}
.content-left:hover{
    box-shadow: 0px 4px 30px -5px #dde5f0;
    cursor:pointer;
    border:1px solid #fff;
}
.item-2 .swiper-wrapper{
    width:1920px;
    height:761px;
}
/*.item-2{*/

/*}*/
.swiper-l{
    width:1920px;
    height:761px;
    margin-top:90px;
    background:url("images/web元素/背景1.jpg") no-repeat;
    -moz-background-size: 100% 100%;
    -o-background-size: 100% 100%;
    -webkit-background-size:100% 100%;
    background-size: 100% 100%;
    position: relative;
    overflow: hidden;
}
.swiper-i{
    border:1px solid red;
}
 .swiper-left{
    position: absolute;
    left:0px;
    top:366px;
    cursor: pointer;
    width:60px;
    height:140px;
    z-index: 3;
    background: url("images/web元素/圆角矩形-4-拷贝-8.png") no-repeat;
}
 .swiper-right{
    position: absolute;
    right: 0px;
    top:366px;
    cursor: pointer;
    width:60px;
    height:140px;
    z-index:3;
}
 .swiper-item{
    margin:50px 128px 90px 128px;
    float: left;
}
.swiper-l .swiper-a{
    position: absolute;
    z-index:2;
    left:0px;
}
.swiper-l .title-2,.swiper-l .title-2 p{
    color: #fff;
}
.swiper-l .title-2 p{
    font-size:15px;
}
.swiper-item .swiper-active{
    width:300px;
    height:467px;
    cursor: pointer;
    background-color:#3389ff;
    position: relative;
    margin-right:40px;
    float: left;
}
 .swiper-item .swiper-last{
    margin-right:0px;
}
.swiper-l .swiper-item .swiper-active .swiper-home{
    position: absolute;
    left:29px;
    top:70px;
    font-size:18px;
    color: #ffffff;
    border-bottom: 4px solid #ffffff;
    padding-bottom: 12px;
}
.swiper-l .swiper-item .swiper-active .swiper-font{
    position: absolute;
    top:0px;
    right:16px;
}
.swiper-l .swiper-item .swiper-active .swiper-img{
    position: absolute;
    bottom: 0px;
}
.swiper-l .swiper-item .swiper-active .swiper-img img{
    float: left;
}
.articles{
    width:1200px;
    margin:50px auto;
}
.articles .articles-wrapper{
    float: left;
    width:600px;
    height:260px;
    overflow: hidden;
    cursor: pointer;
    transition: 0.4s linear;

}
.articles .articles-wrapper:hover{
    -webkit-box-shadow: 0px 10px 20px 0px #e2e9f3;
    -o-box-shadow: 0px 10px 20px 0px #e2e9f3;
    -ms-box-shadow: 0px 10px 20px 0px #e2e9f3;
    -moz-box-shadow: 0px 10px 20px 0px #e2e9f3;
}
.articles .articles-wrapper .articles-box{
    padding:39px 84px 72px 51px;
}
.articles .articles-wrapper .articles-box .articles-title{
    font-size:18px;
    color: #333;
    padding-bottom: 32px;
}
.articles .articles-wrapper .articles-box p{
    color: #aaa;
    line-height: 24px;
    font-size:14px;
}
.articles .articles-wrapper .articles-box .articles-bottom{
    color: #aaa;
    padding-top:28px;
}
.all{
    margin:50px auto;
    width:240px;
    height:54px;
    text-align: center;
    line-height: 54px;
    border:1px solid #ececec;
    -webkit-border-radius: 22px;
    -moz-border-radius: 23px;
    background-color: #f9f9f9;
    color: #aaaaaa;
    font-size:14px;
    cursor: pointer;
}
.img{
    width:1920px;
    height:350px;
    border:1px solid #fff;
    background:url("../images/web元素/背景2.jpg") no-repeat;
    -webkit-background-size:100% 100%;
    -o-background-size:100% 100%;
    -moz-background-size:100% 100%;
    -ms-background-size:100% 100%;
}
.img .img-big{
    font-size:56px;
    padding-bottom:38px;
}
.img .img-samll{
    font-size:18px;
}
.img .img-box{
    margin-left:386px;
    margin-top:130px;
}
.img .img-box li{
    float: left;
    margin-right: 146px;
    color:#fff;
}
.img .img-box li p{
    text-align: center;
}
.footer{
    width:1200px;
    margin: 0 auto;
    height:90px;
}
.footer .footer-left{
    float: left;
    margin-top:25px;
}
.footer .footer-left .footer-logo{
    float: left;

}
.footer .footer-left .footer-font{
    float: left;
    padding-left:25px;
}
.footer .footer-left .footer-font p{
    line-height: 19px;
    color: #777777 ;
}
.footer .footer-right{
    float: right;
    padding-top:37px;
}
.footer .footer-right li{
    float: left;
    padding-right: 10px;
    padding-left:13px;
    color: #777777;
    border-color:#777777 ;
    border-right:1px solid #777777;
}
.footer .footer-right .join{
    padding-right:0px;
    border-right:1px solid #ffffff;
}
.footer .footer-right .concate{
    color:#4f9bfd;
}
.footer .footer-right li:hover{
    color:#4f9bfd;
}